<template>
    <button class="delete" @click="onClick">
        <slot></slot>
    </button>
</template>

<script>
export default {
    props: {
        onClick: Function
    }
}
</script>

<style lang="less" scoped>
.delete {
    padding: 10px;
    font-size: 16px;
    border-radius: 5px;
    border: none;
    background-color: rgb(253, 47, 47);
    background-color: rgb(128, 38, 38);
    color: white;
    font-weight: 700;
    letter-spacing: 2px;
    transition: 0.3s all ease;
    cursor: pointer;

    &:hover {
        background-color: rgb(253, 47, 47);
    }

    &:active {
        background-color: rgb(172, 37, 37);
    }
}
</style>